Lyx.define(["ui", "drag", "scroll"], function(ui, drag, scroll, Lyx){

	var nextMsg = function()
	{
		if(this.msgQueue.length != 0)
		{
			this.theme.fillMsg.call(this.theme, this.msgQueue.dequeue());
			return true;
		}
		return false;
	}

	var alert = Lyx.createClass(function(p2t){
		p2t.init = function(theme)
		{
			this.theme = theme;

			this.status = false;

			this.msgQueue = Lyx.queue();

			this.status = false;

			if(!Lyx.isUndefined(theme.button))
			{
				if(!Lyx.isUndefined(theme.button.ok))
				{
					ui.hander.add(theme.button.ok, "click", function(){
						theme.callback.ok() ? this.hide() : "";
					}.bind(this));
				}

				if(!Lyx.isUndefined(theme.button.cancel))
				{
					ui.hander.add(theme.button.cancel, "click", function(){
						theme.callback.cancel() ? this.hide() : "";
					});
				}
			}
		}

		p2t.msg = function(msg)
		{
			if(this.status)
			{
				this.msgQueue.enqueue(msg);
			}
			else
			{
				this.theme.fillMsg.call(this.theme, msg);
				this.show.call(this);
			}
		}

		p2t.show = function()
		{
			this.status = true;
			this.theme.show();
		}

		p2t.hide = function()
		{
			if(!nextMsg.call(this))
			{
				this.status = false;
				this.theme.hide();
			}
		}
	});
	
	alert.theme = {
		default: Lyx.createClass(function(p2t){
			p2t.init = function(config)
			{
				Lyx.extend(this, config);
				this.background = ui.addNode(ui.$("body[0]"), "div", "innerEnd", {
					style: {
						position: "fixed",
						left: 0,
						top: 0,
						bottom: 0,
						right: 0,
						zIndex: 2000,
						display: "flex",
						visibility: "hidden",
						justifyContent: "center",
						alignItems: "center",
						webkitPerspective: 150,
						backgroundColor: "rgba(0, 0, 0, 0)"
					}
				});

				// 弹出的窗口
				this.window = ui.addNode(this.background, "div", "innerFirst", {
					style: {
						left: 0,
						top: 0,
						bottom: 0,
						right: 0,
						position: "relative",
						opacity: 0,
						borderRadius: 4,
						transform: "scale(0.7)",
						boxShadow: "0px 0px 20px 0px rgba(0, 0, 0, 0.56)"
					}
				});

				this.title = ui.addNode(this.window, "div", "innerFirst", {
					style:{
						borderRadius: "4px 4px 0 0",
						padding: "20px 10px 0px 20px",
						background: "#fff",
						fontSize: 20,
						fontWeight: 600
					}
				});

				this.content = ui.addNode(this.window, "div", "innerEnd", {
					
					style:{
						padding: "10px 20px 10px 20px",
						background: "#fff"
					}
				});

				this.tail = ui.addNode(this.window, "div", "innerEnd", {
					style: {
						borderRadius: "0 0 4px 4px",
						padding: "10px 10px 15px 20px",
						background: "#fff",
						height: 50
					}
				});

				this.button = {
					ok: ui.addNode(this.tail, "div", "innerFirst"),
					cancel: ui.addNode(this.tail, "div", "innerFirst"),
				};

				ui.css([this.button.ok, this.button.cancel], {
					float: "right",
					background: "#00adff",
					color: "#fff",
					borderRadius: 4,
					width: 60,
					margin: "10px 20px 10px 10px",
					textAlign: "center",
					height: 36,
					lineHeight: 36,
					cursor: "default"
				});
			}

			p2t.fillMsg = function(msg)
			{
				var list = msg.split(" ");
				this.title.innerHTML = list[0];
				this.content.innerHTML = list[1];
				this.button.ok.innerHTML = list[2];
				this.button.cancel.innerHTML = list[3];
			}

			p2t.show = function()
			{
				ui.css(this.window, {
					transition: ".3s",
					opacity: 1,
					transform: "scale(1)",
				});
				this.background.style.visibility = "";
				this.background.style.backgroundColor = "rgba(0, 0, 0, 0.7)";
			}

			p2t.hide = function()
			{
				ui.css(this.window, {
					transition: "",
					transform: "scale(0.7)",
					opacity: 0
				});
				this.background.style.visibility = "hidden";
				this.background.style.backgroundColor = "rgba(0, 0, 0, 0)";
			}

			p2t.callback = {
				ok: function(){
					Lyx.log("你点击了确定！");
					return true;
				},
				cancel: function(){
					Lyx.log("你点击了取消！");
					return true;
				}
			}
		}),
		dnf: Lyx.createClass(function(p2t){
			p2t.init = function(config)
			{
				Lyx.extend(this, config);

				this.background = ui.addNode(ui.$("body[0]"), "div", "innerEnd", {
					style: {
						position: "fixed",
						left: 0,
						top: 0,
						bottom: 0,
						right: 0,
						zIndex: 2000,
						display: "flex",
						visibility: "hidden",
						justifyContent: "center",
						alignItems: "center",
						webkitPerspective: 150,
						backgroundColor: "rgba(0, 0, 0, 0)"
					}
				});

				// 弹出的窗口
				this.window = ui.addNode(this.background, "div", "innerFirst", {
					style: {
						left: 0,
						top: 0,
						bottom: 0,
						right: 0,
						position: "relative",
						opacity: 0,
						transform: "scale(0.7)",
						background: "rgba(0, 0, 0, 0.56)",
						borderRadius: 4,
						color: "#ffec93",
						boxShadow: "0px 0px 20px 0px rgba(0, 0, 0, 0.56)",
						height: 150,
    					width: 600,
    					fontFamily: "仿宋"
					}
				});

				this.title = ui.addNode(this.window, "div", "innerFirst", {
					style:{
						padding: "10px 10px 5px 10px",
    					fontSize: 15,
    					background: "linear-gradient(to bottom, rgba(255, 255, 255, 0.5) -47%, rgba(255, 255, 255, 0) 60%)"
					}
				});

				ui.addNode(this.window, "div", "innerEnd", {
					style: {
						height: 0.8,
    					background: "linear-gradient(to right, rgba(255, 255, 255, 0) 0%,\
     					rgba(255, 236, 147, 0.34) 50%, rgba(255, 255, 255, 0) 70%)"
					}
				});

				var box = ui.addNode(this.window, "div", "innerEnd", {
					style:{
						margin: "5px 10px 10px 10px",
						fontSize: 14,
						width: "70%",
						lineHeight: 24,
						height: 70,
						padding: "0 3px 0 0"
					}
				});

				this.content = ui.addNode(box, "div", "innerEnd", {
					style: {
						width: "99%",
    					margin: 0
					}
				});

				this.button = {};

				this.button.ok = ui.addNode(this.window, "div", "innerEnd", {
					style: {
						position: "absolute",
						right: "35%",
						bottom: 10,
						fontWeight: 900,
						textShadow: `0 0 10px #000, 0 0 20px #b6d1ff,
						0 0 30px #00a8ff, 0 0 40px #228DFF, 0 0 70px #228DFF, 
						0 0 80px #228DFF, 0 0 100px #228DFF, 0 0 150px #228DFF`
					}
				});

				this.button.ok.innerHTML = "空格";

				var imgBox = ui.addNode(this.window, "div", "innerEnd", {
					style: {
						bottom: 0,
						right: 0,
						height: 200,
						width: "30%",
						position: "absolute"
					}
				});

				ui.addNode(imgBox, "img", "innerFirst", {
					src: "img/赛利亚.png",
					style: {
						width: "100%",
						position: "absolute",
						bottom: 0
					}
				});

				drag(this.title, {
					down: function(drag){
						this.window.style.transition = "0s";
						drag.inner.x = parseInt(this.window.style.left);
						drag.inner.y = parseInt(this.window.style.top);
					},
					move: function(drag)
					{
						drag.style.top = drag.top;
						drag.style.left = drag.left;
						ui.css(this.window, {
							top: drag.inner.y + drag.offsetY,
							left: drag.inner.x + drag.offsetX
						});
					},
					up: function(){
						this.window.style.transition = ".3s";
					}
				}, this);

				this.scr = scroll(box, {
					barWidth: 1,
					xBarSwitch: false,
					yBarSwitch: true,
					yBarBack: {
						background: ""
					},
					yBar: {
						background: "rgba(255,255,255,0.2)"
					},
					speed: 24
				});
			}

			p2t.fillMsg = function(msg)
			{
				this.title.innerHTML = msg.title;
				this.content.innerHTML = msg.content;
				this.scr.update("y");
			}

			p2t.show = function()
			{
				ui.css(this.window, {
					transition: ".3s",
					opacity: 1,
					transform: "scale(1)",
				});
				this.background.style.visibility = "";
			}

			p2t.hide = function()
			{
				ui.css(this.window, {
					transition: "",
					transform: "scale(0.7)",
					opacity: 0
				});
				this.background.style.visibility = "hidden";
			}

			p2t.callback = {
				ok: function(){
					console.log("你点击了空格！");
					return true;
				}
			}
		})
	};
	return alert;
});